<template>
  <div>
    <a-modal
      :visible="visible"
      :width="1200"
      title="指标专题详情"
      wrapClassName="topic-list-modal"
      @cancel="handleCancel"
    >
      <TopicIndexInfoList :topicId="topicId" />

      <template slot="footer">
        <a-button @click="handleCancel">关闭</a-button>
      </template>
    </a-modal>
  </div>
</template>
<script>
import TopicIndexInfoList from '@views/dashboard/components/TopicIndexInfoList.vue'

export default {
  name: 'TopicListModal',
  components: {
    TopicIndexInfoList
  },
  data() {
    return {
      visible: false,
      topicId: ''
    }
  },
  methods: {
    show(id) {
      this.topicId = id
      this.visible = true
      // this.getTopicInfo()
    },
    handleCancel() {
      this.$emit('cancel')
      this.visible = false
    }
  }
}
</script>
<style lang="less" scoped>
.topic-list-modal {
  .ant-modal-body {
    padding: 10px 15px;
    //height: calc(100vh - 308px);
  }

  .ant-table-tbody > tr > td {
    max-width: 200px;
    min-width: 70px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
    word-break: break-all;
  }
}
</style>
